<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="./less/reset.css">
    <link rel="stylesheet" href="./less/common.css">

    <!--less文件引入的时候，要加上 rel="stylesheet/less" 为 less -->
    <link rel="stylesheet/less" type="text/css" href="./less/index.less"/>
    <!--引入编译文件-->
    <script src="./js/less.min.js"></script>

    <title>妆美人-首页</title>
</head>
<body>
<div class="container">
    <div class="header">
        妆美人
    </div>
    <div class="content">
        <div class="banner">
            <img src="./imgs/banner1.png" alt="">
        </div>
        <div class="nav">
            <a href="#">
                <img src="./imgs/icon_order.png" alt="">
                订单管理
            </a>
            <a href="#">
                <img src="./imgs/icon_order.png" alt="">
                订单管理
            </a>
            <a href="#">
                <img src="./imgs/icon_order.png" alt="">
                订单管理
            </a>
            <a href="#">
                <img src="./imgs/icon_order.png" alt="">
                订单管理
            </a>


            <a href="#">
                <img src="./imgs/icon_order.png" alt="">
                订单管理
            </a>
            <a href="#">
                <img src="./imgs/icon_order.png" alt="">
                订单管理
            </a>
            <a href="#">
                <img src="./imgs/icon_order.png" alt="">
                订单管理
            </a>
            <a href="#">
                <img src="./imgs/icon_order.png" alt="">
                订单管理
            </a>

        </div>
        <div class="ad">
            <a href="#"> <img src="./imgs/ad1.png" alt=""></a>
        </div>
        <div class="hot-goods">
            <div class="title">
                <h2>热门商品 <span>HOT</span></h2>
            </div>
            <div class="info">
                <div class="left">
                    <img src="./imgs/cxrekuan.png" alt="">
                </div>
                <div class="right">
                    <div class="r-top">
                        <img src="./imgs/hrqg.png" alt="">
                    </div>
                    <div class="r-bottom">
                        <img src="./imgs/bzrt.png" alt="">
                    </div>
                </div>
            </div>
        </div>


    </div>
    <div class="footer">
        <a href="#" class="active">
            <img src="./imgs/icon_home.png" alt="">
            首页
        </a>

        <a href="#">
            <img src="./imgs/icon_xin.png" alt="">
            基金会
        </a>

        <a href="#">
            <img src="./imgs/icon_colleage.png" alt="">
            商学院
        </a>

        <a href="#">
            <img src="./imgs/icon_cart.png" alt="">
            购物车
        </a>

        <a href="#">
            <img src="./imgs/icon_me.png" alt="">
            我的
        </a>
    </div>
</div>
</body>
</html>
